<template>
  <view class="normal-login-container">

    <view class="item-wrap" style="margin-bottom: 0">
      <view class="lineBottom10">
        <uni-section title="装饰信息" type="line"/>
      </view>

      <view style="margin: 8rpx 20rpx 8rpx 20rpx">
        <uni-forms ref="ruleForm" :rules="rules" :label-position="boole ? 'top' : 'left'"
                   :model="ruleForm" labelWidth="auto">

          <uni-forms-item label="预计开始时间:" name="expectStartTime" :required="boole">
            <text class="expectStartTime"/>
            <uni-datetime-picker v-if="boole" type="date" placeholder="请选择装饰预计开始日期"
                                 return-type="string" v-model="ruleForm.expectStartTime"/>
            <text v-else>{{ ruleForm.expectStartTime || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="预计装饰结束日期:" name="expectEndTime" :required="boole">
            <text class="expectEndTime"/>
            <uni-datetime-picker v-if="boole" type="date" placeholder="请选择预计装饰结束日期"
                                 :start="ruleForm.expectStartTime"
                                 return-type="string" v-model="ruleForm.expectEndTime"/>
            <text v-else>{{ ruleForm.expectEndTime || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="供应商:" name="supplierId" :required="boole">
            <text class="supplierId"/>
            <zxz-uni-data-select v-if="boole" v-model="ruleForm.supplierId" :localdata="options"
                                 dataKey="supplierName" dataValue="supplierId"
                                 placeholder="请选择供应商"
                                 @change="handleChange"
                                 :clear="true" filterable/>
            <text v-else>{{ ruleForm.supplierName || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="装饰费用:" name="price" :required="boole">
            <text class="faultDescribe"/>
            <uni-easyinput v-if="boole" v-model="ruleForm.price" disabled
                           placeholder="请输入装饰费用"/>
            <text v-else>{{ ruleForm.price || '-' }}</text>
          </uni-forms-item>

          <uni-forms-item label="备注:">
            <uni-easyinput type="textarea" v-if="boole" :maxlength="490" v-model="ruleForm.remark" placeholder="请输入备注"/>
            <text v-else>{{ ruleForm.remark || '-' }}</text>
          </uni-forms-item>


        </uni-forms>
      </view>
    </view>
  </view>
</template>

<script>
import {getInsuranceSelectList} from "@/api/maintain/maintainList";

export default {
  name: 'decorationInfo',//装饰信息
  props: {
    value: {
      type: Object,
      default: {}
    },
    boole: {
      type: Boolean,
      default: true
    }
  },
  computed: {
    ruleForm: {
      get() {
        let that = this
        const proxy = new Proxy(that.value, {
          get(target, key) {
            return Reflect.get(target, key)
          },
          set(target, key, value) {
            that.$emit('input', {...target, [key]: value})
            return true
          }
        })
        return proxy
      }
    },
  },
  watch: {},
  data() {
    return {
      options: [],
      rules: {
        expectStartTime: {
          rules: [
            {required: true, errorMessage: "请选择装饰预计开始日期", validateTrigger: 'bind'},
          ],
        },
        expectEndTime: {
          rules: [
            {required: true, errorMessage: "请选择预计装饰结束日期", validateTrigger: 'bind'},
          ],
        },
        supplierId: {
          rules: [
            {required: true, errorMessage: "请选择供应商", validateTrigger: 'bind'},
          ],
        },
        price: {
          rules: [
            {required: true, errorMessage: "请输入装饰费用", validateTrigger: 'blur'},
          ],
        },
      }
    };
  },
  created() {
  },
  mounted() {
    this.handleList()
  },
  methods: {
    handleChange(val) {
      if (val) {
        this.value.supplierId = this.ruleForm.supplierId = val.supplierId
        this.value.supplierName = this.ruleForm.supplierName = val.supplierName
      }else{
        this.value.supplierId = this.ruleForm.supplierId = ''
        this.value.supplierName = this.ruleForm.supplierName = ''
      }
    },

    handleList() {
      getInsuranceSelectList({businessTypeCode: ""}).then((res) => {
        if (res.code === 200) {
          this.options = res.data;
        }
      });
    },

    handleEffect() {
      return new Promise((resolve, reject) => {
        this.$refs.ruleForm.validate().then(res => {
          resolve();
        }).catch(err => {
          let key = ".flex-col" + ">>>" + "." + err[0].key;
          reject(key);
        })
      });
    },
  },
};
</script>

<style scoped lang=""></style>


